<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <title>NiznO bestandsbeheer V2.0</title>
    <link rel="stylesheet" type="text/css" href="css/front.css" />
    <link rel="stylesheet" type="text/css" href="images/icons.php" />
    <script type="text/javascript">
      function getElementsByClassName(e, needle) { /* modified version of crisp's getElementsByClassName, this version expects an parent-element as a first argument */
        var s = [], r = [], undefined;
      /*  var e = document.documentElement || document.body; */
        var re = new RegExp('(^|\\s)' + needle + '(\\s|$)');
    
        while (e !== undefined) {
          while (e) {
            if (e.nodeType == 1) {
              if (e.className && re.test(e.className)) r.push(e);
              s.push(e.firstChild);
            }
            e = e.nextSibling;
          }
          e = s.pop();
        }
        return r;
      }
      var TYPE_UNKNOWN = 0;
      var TYPE_MAP = 1;
      var TYPE_FILE = 2;
      var CTRL_DOWN = false;
      var CTRL = 17;
      var DEL = 46;
    </script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/jquery.ext.js"></script>
    <script type="text/javascript" src="js/blueimp-jQuery-File-Upload/jquery.iframe-transport.js"></script>
    <script type="text/javascript" src="js/blueimp-jQuery-File-Upload/jquery.fileupload.js"></script>
    <script type="text/javascript" src="js/menu.js"></script>
    <script type="text/javascript" src="js/dragsections.js"></script>
    <script type="text/javascript" src="js/ajax.js"></script>
    <script type="text/javascript" src="js/uploader.js"></script>
    <script type="text/javascript" src="js/filelist.js"></script>
    <script type="text/javascript" src="js/fileopp.js"></script>
    <script type="text/javascript">
      var oMenu = new Menu();
      var oDragSec = new DragableSections();
      var oAjax = new Ajax();
      var oUploader = new Uploader();
      var oFileOpp = new FileOpp();
      var oFileList = new FileList();
      
      function getColNr(jCol) {
        var sColId = jCol.attr('id');
        return parseInt(sColId.substring(6, sColId.length));
      }
      function getListNr(jElement) {
        var sListId = jElement.closest('table').attr('id');
        return parseInt(sListId.substring(9, sListId.length));
      }
      
      var mDrag = {
        cursor:'default',
//        appendTo:'body',
        addClasses:false,
        helper:'clone'
      };
      var mDropItem = {
        greedy:true,
        drop:function(e, ui) {
          oFileOpp.dropOnItem(ui.draggable, $(this));
        },
        hoverClass:'hovermap'
      };
      var mDropView = {
        greedy:true,
        drop:function(e, ui) {
          oFileOpp.dropOnView(ui.draggable, $(this));
        },
        hoverClass:'hoverview'
      }
      
      $(function() {
        $(window).keydown(function(event) {
          switch (event.which) {
            case CTRL: CTRL_DOWN = true; break;
          }
        });
        $(window).keyup(function(event) {
          switch (event.which) {
            case CTRL: CTRL_DOWN = false; break;
          }
        });
        
        oMenu.init();
        oDragSec.init();
        oUploader.init();
        
        $('#list1, #list2').droppable(mDropView);
        oUploader.enableUpload($('#list1'));

        oAjax.getDir('', function(data) { 
          oDragSec.setList(oFileList.getTbody(data, ''), 1);
          oDragSec.setList(oFileList.getTbody(data, ''), 2);
          oDragSec.setTree(oFileList.getUl(data, '', false));
          oDragSec.addColumn(oFileList.getUl(data, '', true), 1);
        });
        $('#lists').delegate('.map', 'dblclick', function(event) {
          if (event.button != 0)
            return;
          var self = $(this);
          oAjax.getDir(self.attr('filepath'), function(data) {
            oDragSec.setList(oFileList.getTbody(data, self.attr('filepath')), getListNr(self));
          });
        });
        $('#columns').delegate('.map', 'click', function(event) {
          if (event.button != 0)
            return;
          var self = $(this);
          oAjax.getDir(self.attr('filepath'), function(data) {
            oDragSec.addColumn(oFileList.getUl(data, self.attr('filepath'), true), getColNr(self.closest('ul'))+1);
          });
        });
        $('#tree').delegate('.map span', 'click', function(event) {
          if (event.button != 0)
            return;
          var self = $(this).closest('li');
          oAjax.getDir(self.attr('filepath'), function(data) {
            if (self.find('ul').length > 0)
              self.find('ul').remove();
            else
              self.append(oFileList.getUl(data, self.attr('filepath'), false));
            oDragSec.setList(oFileList.getTbody(data, self.attr('filepath')), 1);
          });
        });
      });
      
      window.onmouseup=function() {
        oDragSec.mouseLetGo();
      }
      window.onmousemove=function(e) {
        e=(e)?e:window.event;
        oDragSec.mouseMove(e);
      }
      window.onmousedown=function(e) {
        if (e.preventDefault) {
          e.preventDefault(); // W3C
        }
        e.returnValue=false; // IE
      }
    </script>
  </head>
 
  <body>
    <ul id="menu">
      <li>File
        <ul>
          <li>etc blablabla</li>
        </ul>
      </li>
      <li>View
        <ul>
          <li id="cHideColumns" class="balknop">Close Columnview</li>
          <li id="cHideTree" class="balknop">Close Treeview</li>
          <li id="cHide2ndMain" class="balknop">Close 2nd Fileview</li>
          <li id="cSwitch2ndMain" class="balknop">Switch 2nd Fileview</li>
        </ul>
      </li>
      <li id="message"></li>
    </ul>
    
    <div id="uploadfeedback">
      <div id="progressbar"></div>
      <div id="donemessages"></div>
      <button id="sluit">Sluit</button>
    </div>
    
    <div id="tree">
    </div>
    <div id="draglr"></div>
    <div id="lists">
      <div id="list1">
        <table id="fileslist1">
          <thead>
            <tr><td colspan="4" id="showpath1"></td></tr>
            <tr><td>Filename01</td><td>Kind</td><td>Size</td><td>Modified</td></tr>
          </thead>
          <tbody>
          </tbody>
        </table>
      </div>
      <div id="draglist"></div>
      <div id="list2">
        <table id="fileslist2">
          <thead>
            <tr><td colspan="4" id="showpath2"></td></tr>
            <tr><td>Filename01</td><td>Kind</td><td>Size</td><td>Modified</td></tr>
          </thead>
          <tbody>
          </tbody>
        </table>
      </div>
    </div>

    <div id="dragud"></div>

    <div id="columns">
      <div id="setcolumnsize">
        <div id="getcolumnsize">
          <table id="columnstable" cellspacing="0" cellpadding="0">
            <tr>
            </tr>
          </table>
        </div>
      </div>
    </div>
  </body>
</html>
